<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>01_浮动简介</title>
    <style>
        div {
            width: 600px;
            height: 400px;
            background-color: skyblue;
        }
        img {
            width: 200px;
            float: right;
            /* margin-right: 1em; */
        }
        .test::first-letter {
            font-size: 80px;
            float: left;
        }
    </style>
</head>
<body>
    <div>
        <img src="../images/自拍.jpg" alt="">
        Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto, accusamus quaerat porro id reprehenderit quam, sed consectetur fugit alias unde voluptatem soluta quas aperiam illo magnam nobis aliquid? Sunt, porro!
    </div>
    <hr>
    <div class="test">
        Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quidem, nesciunt fugit atque odit esse expedita cupiditate quo in deserunt porro, laboriosam, quisquam sequi facilis? Exercitationem consequatur iusto tempore quae veniam molestias aperiam cupiditate provident magni expedita pariatur itaque ad natus earum dolore ratione, vero reprehenderit nulla nihil optio rerum dignissimos?
    </div>
</body>
</html>
